<!DOCTYPE html>
<html>
<head>
	<title></title>
	<meta charset="utf-8" />
	<script type="text/javascript" src="jquery-3.3.1.js"></script>
</head>
<body>
	<div>
		<div class="search_bar">
			<ul id="search_list">
				<li onclick=""></li>
			</ul>
		</div>
	</div>
</body>
</html>
<style type="text/css">
li{list-style: none;}
.mmp{
	height:60px;
	width:60px;
	background-color:#eee;
	margin:10px;
}
.inner_mmp{
	height:40px;
	width:40px;
	background-color:red;
}
</style>
<script type="text/javascript">
	let i,arr=['00','11',22,33,44,55,66];
	for(i=0;i<arr.length;i++){
		let li='<li class="mmp cls_'+i+'"><div class="inner_mmp cls_'+i+'"></div></li>';
		$("#search_list").append(li);
	}
	$("#search_list .mmp").click(function(e){
		let index=$("#search_list .mmp").index(this)
		console.log(index,$(this).index(),e.target,e.target.tagName,e.target.className);
		alert(arr[index]);
	})

</script>